<form method="post" action="/_/api" class="form-horizontal" target="ifr_form" autocomplete="off">
<input type="hidden" name="do" value="base">
<fieldset>
<legend>模块基础信息

 {{if .api.Exists}}
<div class="legend_note">
访问地址：<a href="{{.api_url}}" target="_blank">{{.api_url}}</a>
&nbsp;<span class="glyphicon glyphicon-new-window"></span>
</div>
{{end}}

<span class="legend_note pull-right">
{{if .api.Exists}}
<a href="/_/analysis?name={{.api.Name}}">协议分析</a>&nbsp;
{{end}}
pv: &nbsp;<span id="api_pv_{{.api.Name}}">{{.api.GetPv}}</span>&nbsp;
</span>
</legend>

<div class="form-group">
    <label class="col-sm-2 control-label required">英文名称:</label>
    <div class="col-sm-3">
        {{if .api.Exists}}
        <input type="hidden" name="api_name" value="{{.api.Name|html}}">
        <input type="hidden" name="mod" value="update">
        <div >{{.api.Name|html}}
         {{if .userCanEdit}}
            <button type="button" class="btn btn-link" data-toggle="modal" data-target="#modifyApiNameModal" data-whatever="{{.api.Name|html}}">修改</button>
         {{end}}
        </div>
        {{else}}
        <input type="hidden" name="mod" value="new">
         <input class="form-control" type="text" required="required" pattern="[\w-]+" name="api_name" value="{{.api.Name|html}}" placeholder="需满足 [\w-]+，全局唯一"> 
        {{end}}
    </div>
    <div class="help-block">
       模块唯一标识，由英文、数字组成。
    </div>
</div>

<div class="form-group">
    <label class="col-sm-2 control-label required">绑定目录:</label>
    <div class="col-sm-3">
     <input class="form-control" type="text" name="path" value="{{.api.Path}}" pattern="/([\w-]+/?)*" placeholder="需满足/([\w-]+/)*">
    </div>
    <div class="help">
       接口URI的目录部分，如原接口<b>http://a.com/<font color="blue">action</font>/info.php</b>,
       则此处填写 <font color="blue">/action/</font>,支持多级目录。<br/>
       类似于nginx的 <font color="blue">location /action/</font>指令。
    </div>
</div>
<div class="form-group">
    <label class="col-sm-2 control-label">备注:</label>
    <div class="col-sm-8">
     <input class="form-control" type="text" name="note" value="{{.api.Note|html}}">
    </div>
</div>

<div class="form-group">
    <label class="col-sm-2 control-label">超时:</label>
    <div class="col-sm-3">
	    <div class="input-group">
	        <input class="form-control text-right" type="text" name="timeout" value="{{.api.TimeoutMs}}">
	        <div class="input-group-addon">ms</div>
    </div>
    </div>
</div>


<div class="form-group">
    <label class="col-sm-2 control-label">状态:</label>
    <div class="col-sm-3 checkbox">
        <label>
        <input  type="checkbox" name="enable" value="1" {{if .api.Enable}}checked=checked{{end}}>
        启用
        </label>
    </div>
    <div class="col-sm-3"><label class="checkbox" style="font-weight: normal;"><input type="checkbox" id="check_box_adv">高级设置</label></div>
</div>

<div id="form_base_adv" style="display: none">
    <div class="form-group">
        <label class="col-sm-2 control-label">管理员列表:</label>
        <div class="col-sm-8">
            <div><input class="form-control" type="text" name="uids" value="{{.api.Users|html}}"></div>
            <div class="help">多个使用竖线[ <font color="blue">|</font> ]连接,若包含[&nbsp;<font color="blue">:any</font>&nbsp;]则任意用户都有权限!</div>
        </div>
    </div>
    
    <div class="form-group">
        <label class="col-sm-2 control-label">二级HTTP代理:</label>
        <div class="col-sm-3">
            <div><input class="form-control" type="text" name="proxy" value="{{.api.Proxy|html}}" pattern="^http:\/\/.*" placeholder="http://u:p@127.0.0.1:3308" title="目前只支持http代理,使用二级代理则后端服务不能是代理模式"></div>
        </div>
    </div>
</div>

</fieldset>

<fieldset id="fieldset_hosts">
<legend>后端服务  {{if .userCanEdit}}<a onclick="proxy_api_host_add();return false;" href="#">+</a>{{end}}
&nbsp;
<span class="legend_note">
 <label title="后端当作代理服务器&#10;程序读到的HTTP_HOST将是{{.req_host}}&#10;当系统登陆跳转异常时可打开此选项">
      <input  type="checkbox" name="host_as_proxy" value="1" {{if .api.HostAsProxy}}checked=checked{{end}}>
      代理模式
 </label>
 &nbsp;
 </span>
</legend>
 <p class="text-muted">流量会复制到每个后端服务,然后随机选取其中一个Response返回。</p>
 <div id="div_hosts">
{{range $name,$host:=.api.Hosts}}
  <div>
    {{if in_array $name $.cookiePref}}
     <div class="bg-success my-panel" title="该后端已经设置为cookie的默认优先后端了，直接浏览器访问优先返回该主机结果">
    {{end}}
     {%my_include "api/form_base_host_row.html"%}
    {{if in_array $name $.cookiePref}}
    </div>
    {{end}}
  </div>
{{end}}
 </div>
</fieldset>
<script>
$().ready(function(){
    $("#check_box_adv").change(function(){
        $("#form_base_adv").toggle();
    });
});
</script>
 {%my_include "api/submit.html"%}
</form>

<div class="hidden" id="api_host_tpl">
  {{range $name,$host:=.HostsTpl}}
    {%my_include "api/form_base_host_row.html"%}
  {{end}}
</div>


{{if and .api.Exists .userCanEdit}}
    {%my_include "api/form_rename_modal.html"%}
{{end}}
